var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
define(["require", "exports", "maishu-chitu-admin/static", "../services/data-sources", "maishu-wuzhui-helper", "react-dom", "react", "maishu-ui-toolkit", "services/account-service", "maishu-dilu"], function (require, exports, static_1, data_sources_1, maishu_wuzhui_helper_1, ReactDOM, React, ui, account_service_1, maishu_dilu_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    class UserListPage extends static_1.DataListPage {
        constructor(props) {
            super(props);
            this.account = this.props.createService(account_service_1.AccountService);
            this.dataSource = data_sources_1.dataSources.user;
            this.itemName = "用户";
            this.columns = [
                maishu_wuzhui_helper_1.boundField({ dataField: "Mobile", headerText: "手机" }),
                maishu_wuzhui_helper_1.boundField({ dataField: "NickName", headerText: "昵称" }),
                maishu_wuzhui_helper_1.boundField({ dataField: "Gender", headerText: "性别" }),
                maishu_wuzhui_helper_1.boundField({ dataField: "Balance", headerText: "余额", dataFormatString: "￥{C2}", itemStyle: { textAlign: "right" } }),
                maishu_wuzhui_helper_1.dateTimeField({ dataField: "CreateDateTime", headerText: "注册日期" }),
            ];
            this.operationColumn = maishu_wuzhui_helper_1.customField({
                headerText: "操作",
                headerStyle: { textAlign: "center", width: "200px" },
                itemStyle: { textAlign: "center" },
                createItemCell: (dataItem) => {
                    let cell = new maishu_wuzhui_helper_1.GridViewCell();
                    ReactDOM.render(React.createElement(React.Fragment, null,
                        React.createElement("button", { key: "records", className: "btn btn-success btn-minier" },
                            React.createElement("i", { className: "icon-reorder" }),
                            React.createElement("span", null, "\u5145\u503C\u8BB0\u5F55")),
                        React.createElement("button", { key: "recharge", className: "btn btn-info btn-minier", onClick: () => this.showRechargeDialog(dataItem) },
                            React.createElement("i", { className: "icon-money" }),
                            React.createElement("span", null, "\u5145\u503C"))), cell.element);
                    return cell;
                }
            });
            this.state = { accounts: [] };
        }
        showRechargeDialog(userInfo) {
            // account: string, mobile: string
            this.selectedUserInfo = userInfo;
            let account = userInfo.Id;
            let mobile = userInfo.Mobile;
            console.assert(account != null);
            console.assert(mobile != null);
            this.accountInput.value = account;
            this.mobileElement.innerHTML = mobile;
            ui.showDialog(this.rechargeDialogElement);
        }
        recharge() {
            return __awaiter(this, void 0, void 0, function* () {
                let isValid = yield this.validator.check();
                if (!isValid)
                    return;
                let userId = this.accountInput.value;
                let amount = Number.parseFloat(this.amountInput.value);
                let message = `账户：${this.mobileElement.innerHTML}<br/><br/>金额：${this.amountInput.value}`;
                let bill = yield this.account.createBill(userId, amount);
                ui.confirm({
                    title: "请确认", message,
                    confirm: () => __awaiter(this, void 0, void 0, function* () {
                        let r = yield this.account.recharge(userId, bill.Id, this.receivementAccountElement.value);
                        console.assert(this.selectedUserInfo != null);
                        this.selectedUserInfo.Balance = r.Balance;
                        this.dataSource.updated.fire(this.dataSource, this.selectedUserInfo);
                        ui.hideDialog(this.rechargeDialogElement);
                        ui.alert('冲值成功');
                    })
                });
            });
        }
        componentDidMount() {
            console.assert(super.componentDidMount != null);
            super.componentDidMount();
            let { required, greaterThan } = maishu_dilu_1.rules;
            this.validator = new maishu_dilu_1.FormValidator(this.rechargeDialogElement, { name: "amount", rules: [greaterThan(() => 0, "金额必须大于 0")] }, { name: 'receivementAccount', rules: [required('请选择收款账户')] });
            this.account.receivementAccountList().then(items => {
                this.setState({ accounts: items });
            });
        }
        render() {
            let { accounts } = this.state;
            accounts = accounts || [];
            return React.createElement(React.Fragment, null,
                super.render(),
                React.createElement("div", { key: 30, className: "modal fade", ref: (e) => this.rechargeDialogElement = e || this.rechargeDialogElement },
                    React.createElement("div", { className: "modal-dialog" },
                        React.createElement("div", { className: "modal-content" },
                            React.createElement("div", { className: "modal-header" },
                                React.createElement("button", { type: "button", className: "close", "data-dismiss": "modal" },
                                    React.createElement("span", { "aria-hidden": "true" }, "\u00D7"),
                                    React.createElement("span", { className: "sr-only" }, "Close")),
                                React.createElement("h4", { className: "modal-title" }, "\u5145\u503C")),
                            React.createElement("div", { className: "modal-body form-horizontal" },
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-sm-2 control-label" }, "\u5145\u503C\u8D26\u6237"),
                                    React.createElement("div", { className: "col-sm-10" },
                                        React.createElement("div", { ref: (m) => this.mobileElement = m || this.mobileElement }),
                                        React.createElement("input", { name: "userId", className: "form-control", placeholder: "\u8BF7\u8F93\u5165\u8981\u5145\u503C\u7684\u8D26\u6237", readOnly: true, type: "hidden", ref: (e) => this.accountInput = e || this.accountInput }))),
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-sm-2 control-label" }, "\u91D1\u989D"),
                                    React.createElement("div", { className: "col-sm-10" },
                                        React.createElement("input", { name: "amount", className: "form-control", placeholder: "\u8BF7\u8F93\u5165\u8981\u5145\u503C\u7684\u91D1\u989D", ref: (e) => this.amountInput = e || this.amountInput }))),
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-sm-2 control-label" }, "\u6536\u6B3E\u8D26\u6237"),
                                    React.createElement("div", { className: "col-sm-10" },
                                        React.createElement("select", { name: "receivementAccount", className: "form-control", ref: (e) => this.receivementAccountElement = e || this.receivementAccountElement },
                                            React.createElement("option", { value: "" }, "\u8BF7\u9009\u62E9\u6536\u6B3E\u8D26\u6237"),
                                            accounts.map(o => React.createElement("option", { key: o.Id, value: o.Id }, o.Name)))))),
                            React.createElement("div", { className: "modal-footer" },
                                React.createElement("button", { className: "btn btn-default", onClick: () => ui.hideDialog(this.rechargeDialogElement) }, "\u53D6\u6D88"),
                                React.createElement("button", { className: "btn btn-primary", ref: (e) => {
                                        if (!e)
                                            return;
                                        e.onclick = ui.buttonOnClick(() => this.recharge());
                                    } }, "\u786E\u5B9A"))))));
        }
    }
    exports.default = UserListPage;
});
